<template>
  <div class="m-purchaseView">
    <!-- <el-table :data="tableData" style="width: 400px" border>
      <el-table-column prop="purOrgCode" label="采购组织编号" width="120"></el-table-column>
      <el-table-column prop="purOrgName" label="采购组织名称"></el-table-column>
    </el-table>-->
    <div class="m-agTable">
      <agGridComponents
        ref="agGridComponent"
        :getColumnDefs="columnDefs"
        :getRowSelection="'single'"
        :getGridOptions="gridOptions"
        :getRowData="tableData"
        :isColFit="true"
      ></agGridComponents>
    </div>
  </div>
</template>

<script>
import agGridComponents from "@/components/agGridComponents"
export default {
  data () {
    return {
      columnDefs: [],
      gridOptions: {}
    }
  },
  props: {
    tableData: {
      type: Array
    }
  },
  methods: {
  },
  components: {
      agGridComponents
  },
  beforeMount () {
    this.gridOptions = {
      context: {
        componentParent: this
      },
      defaultColDef: {
        menuTabs: []
      },
      enableColResize: true,
      suppressContextMenu: true, //取消右键显示菜单
      enableFilter: false, //允许过滤(可以插入自定义过滤控件)
      multiSortKey: 'ctrl', //多列排序
      enableSorting: false, //列排序
      animateRows: true, //排序动画
      suppressRowClickSelection: true //单元格选中,false为选中整行
    }
    this.columnDefs = [
      { headerName: "采购组织编号", field: "purOrgCode", width: 160, tooltipField: 'purOrgCode' },
      { headerName: "采购组织名称", field: "purOrgName", tooltipField: 'purOrgName' }
    ]
  },
  mounted () {
    this.$refs['agGridComponent'].gridOptions.api.setRowData(this.tableData)
  }
}
</script>
<style lang="less">
.m-purchaseView {
  .m-agTable {
    height: 300px;
    .m-agTableContent {
      .ag-tool-panel {
        // display: none;
      }
    }
  }
}
</style>